<template>
	<!-- 退税明细 -->
	<view class="tax-refund_details" v-if="ruleForm && ruleForm.sellerTaxRefundList">
		<view class="u-font-30 u-text-center u-margin-top-60">退款金额</view>
		<view class="account">
			<text class="u-font-36">¥</text>
			<text>{{ruleForm.sellerTaxRefundList.amount | thousands}}</text>
		</view>
		<view class="tax-refund_body">
			<view class="tax-refund_title">银行信息</view>
			<view class="u-flex u-row-between u-font-28 u-margin-top-30">
				<view style="color: #666666;">结算银行</view>
				<view>{{ruleForm.sellerBankList.bankName}}</view>
			</view>
			<view class="u-flex u-row-between u-font-28 u-margin-bottom-30 u-margin-top-24">
				<view style="color: #666666;">银行账号</view>
				<view> {{ruleForm.sellerBankList.accountNo}}</view>
			</view>
			<u-line color="#F2F2F2" />
			<view class="tax-refund_title  u-margin-top-30">退税信息</view>
			<view class="u-flex u-row-between u-font-28 u-margin-top-30">
				<view style="color: #666666;">出口申请单号</view>
				<view>{{ruleForm.sellerTaxRefundList.carOutApplyId}}</view>
			</view>
		</view>
		<view class="tax-refund_body u-margin-top-20">
			<view class="tax-refund_title">上传附件</view>
			<view class="u-flex u-row-between u-font-28 u-margin-top-30"
			v-if="ruleForm.sellerTaxRefundList.payUrl">
				<view style="color: #666666;">支付凭证</view>
				<view class="u-flex" @click="openFile(ruleForm.sellerTaxRefundList.payUrl)">
					<image class="file-icon" src="@/static/img/icon_view@2x.png"></image>
					<text class="u-margin-left-10">查看</text>
				</view>
			</view>
			<view class="u-flex u-row-between u-font-28 u-margin-top-24"
			v-if="ruleForm.sellerTaxRefundList.billUrl">
				<view style="color: #666666;">退税单</view>
				<view class="u-flex"@click="openFile(ruleForm.sellerTaxRefundList.billUrl)">
					<image class="file-icon" src="@/static/img/icon_view@2x.png"></image>
					<text class="u-margin-left-10">查看</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		openFile
	} from '@/utils/index.js'
	export default {
		data(){
			return {
				ruleForm:null
			}
		},
		onLoad(options) {
			this.$api.getTaxRefundById(options).then(res=>{
				this.ruleForm = res.result
			})
		},
		methods:{
			openFile
		}
	}
</script>

<style scoped lang="less">
	.tax-refund_details {
		color: #202020;

		.account {
			font-weight: bold;
			font-size: 32px;
			margin-top: 10px;
			margin-bottom: 30px;
			text-align: center;
		}

		.tax-refund_body {
			background: #FFFFFF;
			box-shadow: 0px 2 4px 0px rgba(217, 226, 233, 0.38);
			border-radius: 8px;
			padding: 15px;
			margin-left: 15px;
			margin-right: 15px;

			.tax-refund_title {
				font-weight: 500;
				color: #202020;
				font-size: 16px;
			}
			.file-icon {
				width: 16px;
				height: 16px;
			}
		}
	}
</style>
<style>
	page {
		background: #F7F7F7;
	}
</style>